import React, { useCallback } from 'react'
import { View, Icon, Button } from '@tarojs/components'
import Taro from '@tarojs/taro'

import { FeedbackWrap } from './styledFeedback'

export default function feedback(props) {
  const { isSubmit, isSucc, onChangeSubmit } = props

  const handleSuccTap = useCallback(() => {
    Taro.navigateBack()
  })
  
  const handleCancelTap = useCallback(() => {
    onChangeSubmit(false)
  })

  return (
    <FeedbackWrap>
      {
        isSubmit && (
          <View class="feedback">
            {
              isSucc ? (
                <View>
                  <Icon type="success" size="60"></Icon>
                  <View>发布成功</View>
                </View>
              ) : (
                <View>
                  <Icon type="cancel" size="60"></Icon>
                  <View>发布失败</View>
                </View>
              )
            }
            
            {
              !isSucc ? (
                <View class="btn">
                  <Button onClick={handleCancelTap}>重新提交</Button>
                </View>
              ) : (
                <View class="btn succ">
                  <Button onClick={handleSuccTap}>返回首页</Button>
                </View>
              )
            }
          </View>
        )
      }
      
    </FeedbackWrap>
  )
}
